<template xmlns:el-col="http://www.w3.org/1999/html">
    <section>
        <!--工具条-->
        <el-popover placement="bottom" title="" width="160" trigger="click">
            <el-row type="flex" class="row-bg" justify="space-around">
                <el-form :inline="true" size="small">
                    <el-col :span="8"><el-input v-model.number="low" @change="numChange(low,high)" :disabled="isDisabled(echo_position) == 'a' ? true : false"/></el-col>
                    <el-col :span="4" style="text-align: center">_</el-col>
                    <el-col :span="8"><el-input v-model.number="high" @change="numChange(low,high)" :disabled="isDisabled(echo_position) == 'd' ? true : false"/></el-col>
                </el-form>
            </el-row>
            <el-row type="flex" class="row-bg" justify="center">
                <el-col><span class="row_tootip_msg">数值范围：{{getRange(low, high)}}</span></el-col>
            </el-row>
            <el-button type="text" slot="reference">{{getRange(low, high)}}</el-button>
        </el-popover>

    </section>


</template>

<script>
    import {isNullTrue} from "../../../common/js/commons";


    export default {
        props: ['low','high','echo_position'],
        data() {
            return {
            }
        },
        methods: {
            getRange(low, high) {
                // TODO:此处规定low为小于 high为大于等于
                if(isNullTrue(low)) {
                    return '≤' + high;
                }
                else if (isNullTrue(high)) {
                    return '≥' + low;
                }
                else {
                    return low + '-' + high;
                }
            }
            ,numChange(low, high) {
                // if(check_validate1(low)){
                //     this.$message.error('错了哦，这是一条错误消息');
                //     return;
                // }
                // //验证
                // function check_validate1(value){
                //     //定义正则表达式部分
                //     var reg = /^[0-9]+.?[0-9]*$/;
                //     if( !reg.test(value) ){
                //         return true;
                //     }
                //     return false;
                // }

                var popVal = {
                    num_low: low ,
                    num_high: high ,
                    echo_position: this.echo_position
                }
                this.$emit('echoVal',popVal);
            }

            ,isDisabled(val){
                if(val.indexOf('a') != -1){
                    return 'a';
                }
                else if(val.indexOf('d') != -1){
                    return 'd';
                }
            }

        },
        // watch: {
        //     low (val) {
        //         this.low = parseInt(val);
        //     }
        // },
        mounted() {}

    }
</script>
<style>

</style>